<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="en">
	<head>
		<base href="<%=basePath%>">
		<meta charset="utf-8" />
		<title></title>
		<meta name="description" content="overview & stats" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<link href="static/css/bootstrap.min.css" rel="stylesheet" />
		<link href="static/css/bootstrap-responsive.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="static/css/font-awesome.min.css" />
		<link rel="stylesheet" href="static/css/ace.min.css" />
		<link rel="stylesheet" href="static/css/ace-responsive.min.css" />
		<link rel="stylesheet" href="static/css/ace-skins.min.css" />
		<script type="text/javascript" src="static/js/jquery-1.7.2.js"></script>
		<script type="text/javascript" src="static/js/jquery.tips.js"></script>
		
		<link rel="stylesheet" type="text/css" href="plugins/webuploader/webuploader.css" />
		<link rel="stylesheet" type="text/css" href="plugins/webuploader/style.css" />
	</head>
<body>
	<div id="zhongxin">
		
    <div id="wrapper">
    <input type="hidden" name="recordid" id="recordid" value="${pd.recordid }"/>
        <div id="container">
             <!--头部，相册选择和格式选择-->

            <div id="uploader">
                <div class="queueList">
                    <div id="dndArea" class="placeholder">
                        <div id="filePicker"></div>
                        <p>或将照片拖到这里，单次最多可选300张</p>
                    </div>
                </div>
                <div class="statusBar" style="display:none;">
                    <div class="progress">
                        <span class="text">0%</span>
                        <span class="percentage"></span>
                    </div><div class="info"></div>
                    <div class="btns">
                        <div id="filePicker2"></div><div class="uploadBtn">开始上传</div> <div  class="btn btn-lg btn-info" onclick="topclose()"> 关闭</div>
                    </div>
                </div>
            </div>
        </div>
    </div>

		</div>
		
		<div id="zhongxin2" class="center" style="display:none"><br/><br/><br/><br/><br/><img src="static/images/jiazai.gif" /><br/><h4 class="lighter block green">提交中...</h4></div>
	
		<!-- 引入 -->
		<script type="text/javascript">window.jQuery || document.write("<script src='static/js/jquery-1.9.1.min.js'>\x3C/script>");</script>
		<script src="static/js/bootstrap.min.js"></script>
		<script src="static/js/ace-elements.min.js"></script>
		<script src="static/js/ace.min.js"></script>
		
    	<script type="text/javascript" src="plugins/webuploader/webuploader.js"></script>
    	<script type="text/javascript" src="plugins/webuploader/upload.js"></script>
		
		<script type="text/javascript">
		$(top.hangge());
		var str = '';
		var recorid=$('#recordid').val();
		function topclose(){
			top.Dialog.close();
		
		}
		
		  var locat = (window.location+'').split('/'); 
	    	if('pictures'== locat[3]){locat =  locat[0]+'//'+locat[2];}else{locat =  locat[0]+'//'+locat[2]+'/'+locat[3];};
	        uploader = WebUploader.create({
	            pick: {
	                id: '#filePicker',
	                label: '点击选择图片'
	            },
	            dnd: '#dndArea',
	            paste: '#uploader',
	            swf: './Uploader.swf',
	            chunked: false,
	            chunkSize: 512 * 1024,
	            //server: 'http://127.0.0.1:8080/pictures/save.do',
	            server: locat+'/pictures/save.do',
	            //runtimeOrder: 'flash',
	            accept: {
	                 title: 'Images',
	                 extensions: 'gif,jpg,jpeg,bmp,png',
	                 mimeTypes: 'image/*'
	             },

	             
	            // 禁掉全局的拖拽功能。这样不会出现图片拖进页面的时候，把图片打开。
	            disableGlobalDnd: true,
	            fileNumLimit: 300,
	            fileSizeLimit: 200 * 1024 * 1024,    // 200 M
	            fileSingleSizeLimit: 50 * 1024 * 1024    // 50 M
	        });
	        //为webuploaded 赋值 formdata
	        uploader.options.formData.recordid = recorid;
	        
	        //webuploaded 返回结果
	        uploader.onUploadAccept= function( file, response){
	        	var pid=response.pid;
					  	if(str=='') str += pid;
					  	else str += ',' + pid;
	        };
	        
		</script>
</body>
</html>